<template>
    <a-space
        direction = "vertical"
        style = "width: 100%;"
    >
        <a-button
            @click = "reload(false)"
        >刷新</a-button>
        <a-divider />
        <a-form
            :label-col = "{ span: 3 }"
            :wrapper-col = "{ span: 14 }"
        >
            <a-form-item
                label = "任务名"
            >
                <a-input
                    v-model:value = "form.name"
                />
            </a-form-item>
            <a-form-item
                label = "描述"
            >
                <a-textarea
                    v-model:value = "form.description"
                />
            </a-form-item>
            <a-form-item
                label = "任务创建时间"
            >
                <a-typography-text>{{ form.createTime }}</a-typography-text>
            </a-form-item>
            <a-form-item
                :wrapper-col = "{ span: 14, offset: 3 }"
            >
                <a-button
                    @click = "saveMissionModify()"
                >保存修改</a-button>
            </a-form-item>
            <a-form-item
                label = "运行状态"
            >
                <a-typography-text
                    type = 'success'
                    v-if = "form.status ==='Running'"
                >运行中</a-typography-text>
                <a-typography-text
                    type = 'warning'
                    v-else
                >已暂停</a-typography-text>
            </a-form-item>
            <a-form-item
                label = "运行线程数"
                v-if = "form.status === 'Running'"
            >
                <a-typography-text>{{ form.thread }}</a-typography-text>
            </a-form-item>
            <a-form-item
                :wrapper-col = "{ span: 14, offset: 3 }"
            >
                <a-button
                    @click = "startMission()"
                    type = "primary"
                    v-if = "form.status === 'Stopped'"
                >Start</a-button>
                <a-button
                    @click = "stopMission()"
                    danger
                    v-else
                >Stop</a-button>
            </a-form-item>
            <a-form-item
                label = "爬虫类型"
            >
                <a-radio-group
                    v-model:value = "form.config.missionType"
                >
                    <a-radio
                        :value = "1"
                    >深度爬虫</a-radio>
                    <a-radio
                        :value = "2"
                    >循环爬虫</a-radio>
                </a-radio-group>
            </a-form-item>
            <a-form-item
                label = "文件存放位置"
            >
                <a-input
                    v-model:value = "form.config.path"
                    placeholder="@开头表示程序根目录"
                />
            </a-form-item>
            <a-form-item
                label = "线程数"
            >
                <a-input-number
                    v-model:value = "form.config.thread"
                    :min = "1"
                    :max = "32"
                />
            </a-form-item>
            <a-form-item
                label = "网址"
            >
                <a-input
                    v-model:value = "form.config.url"
                />
            </a-form-item>
            <a-form-item
                label = "文件类型"
            >
                <a-input
                    v-model:value = "form.config.suffix"
                />
            </a-form-item>
            <a-form-item
                :wrapper-col = "{ span: 14, offset: 3 }"
            >
                <a-button
                    @click = "saveConfigModify()"
                >保存修改</a-button>
            </a-form-item>
        </a-form>
    </a-space>
</template>

<script>
import Axios from 'axios';
import Dialog from '@/utils/dialog.js';

export default {
    data() {
        return { // 只是为了展示一下有哪些参数
            missionId: this.$route.params.id,
            form: {
                status: '',
                thread: 0, // 这个是现在有多少线程在运行
                taskName: '',
                createTime: '',
                description: '',
                config: {
                    missionType: 2,
                    path: '',
                    thread: 8,
                    url: '',
                    suffix: ''
                }
            },
            tmpForm: {},
        }
    },
    created() {
        this.reload(true);
    },
    methods: {
        reload(quiet) {
            Axios.get(
                "/mission/" + this.missionId + "/status"
            ).then((response) => {
                if (! quiet) {
                    if (response.data.type == 'success')
                        Dialog.toasts.success(response.data.info);
                    else
                        Dialog.toast.error(response.data.info);
                }
                console.log(response.data);
                this.tmpForm = response.data;
            }).catch(() => {
                Dialog.toasts.error("网络错误");
            }).then(() => {
                Object.assign(this.form, this.tmpForm);
            });
        },
        saveMissionModify() {
            Axios.post(
                "/mission/" + this.missionId + "/modify",
                {
                    "name": this.form.name,
                    "description": this.form.description
                }
            ).then((response) => {
                if (response.data.type == 'success')
                    Dialog.toasts.success(response.data.info);
                else
                    Dialog.toast.error(response.data.info);
            }).catch(() => {
                Dialog.toasts.error("网络错误");
            });
        },
        startMission() {
            Axios.post(
                "/mission/" + this.missionId + "/start"
            ).then((response) => {
                if (response.data.type == 'success')
                    Dialog.toasts.success(response.data.info);
                else
                    Dialog.toast.error(response.data.info);
            }).catch(() => {
                Dialog.toasts.error("网络错误");
            }).then(() => {
                this.reload(true);
            });
        },
        stopMission() {
            Axios.post(
                "/mission/" + this.missionId + "/stop"
            ).then((response) => {
                if (response.data.type == 'success')
                    Dialog.toasts.success(response.data.info);
                else
                    Dialog.toast.error(response.data.info);
            }).catch(() => {
                Dialog.toasts.error("网络错误");
            }).then(() => {
                this.reload(true);
            });
        },
        saveConfigModify() {
            if (this.form.status === "Running"){
                Dialog.toasts.error("任务进行中，请先暂停任务再修改配置");
                return;
            }
            Axios.post(
                "/configure/" + this.missionId + "/rewrite",
                {
                    "paraDict": {
                        "missionType": parseInt(this.form.config.missionType),
                        "path": this.form.config.path,
                        "thread": parseInt(this.form.config.thread),
                        "url": this.form.config.url,
                        "suffix": this.form.config.suffix
                    }
                }
            ).then((response) => {
                if (response.data.type == 'success')
                    Dialog.toasts.success(response.data.info);
                else
                    Dialog.toast.error(response.data.info);
            }).catch(() => {
                Dialog.toasts.error("网络错误");
            }).then(() => {
                this.reload(true);
            });
        }
    }
}
</script>